<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<c:set var="ctx" value="${pageContext.request.contextPath }" />
<link rel="stylesheet"
	href="${ctx }/resources/js/select2/select2.min.css" />
<script type="text/javascript"
	src="${ctx }/resources/js/select2/select2.min.js"></script>
<script type="text/javascript"
	src="${ctx }/resources/js/select2/zh-CN.js"></script>
	<script type="text/javascript">
$(function() {
	webside.form.videoresource.ResourceForm();
})
</script>
<script src="${ctx }/resources/js/upload/ajaxfileupload.js"
	type="text/javascript">
	
</script>
<script type="text/javascript">
function uploadVideoResource() {
    var fileName = $("#cover").val();
    var type = fileName.split(".");
    var ftype = type[type.length - 1]; //获取文件后缀
    $.ajaxFileUpload({
        url: '${ctx }/files/upload/' + ftype,
        secureuri: false, //是否需要安全协议，一般设置为false
        fileElementId: ['cover'], //文件上传域的ID
        dataType: 'json', //返回值类型 一般设置为json
        success: function (data, status) //服务器成功响应处理函数
        {
        	 
            if (data.result == 0) {
            	var fileId = data.data[0].id;
            	var filePath = '/files/view/jpg/' + fileId;
            	$("#hiddenResourceUrl").val(filePath);
            	//显示图片
				$("#imgCover").attr("src",'${ctx}/files/view/jpg/' + fileId);
				//显示名字
				$("#labcover").html(data.data[0].name);
            }
        },
        error: function (data, status, e) //服务器响应失败处理函数
        {
            alert(e);
        }
    });
}
</script>

<style>
.iconShow
{
	padding-left: 10px; 
	padding-top: 3px;
}
.source-icon
{
	 width:95%;
	 float:left;
}
@media screen and (max-width: 374px){
	.source-icon
	{
		 width:82%;
	}
}
@media screen and (min-width: 375px) and (max-width: 449px){
	.source-icon
	{
		 width:85%;
	}
}
@media screen and (min-width: 450px) and (max-width: 1279px) {
	.source-icon
	{
		 width:90%;
	}
}
@media screen and (min_width: 1280px) {
	.source-icon
	{
		 width:90%;
	}
}
</style>
<div class="page-header">
	<h1>
		<c:if test="${empty videoResourceEntity}">
		新增资源
		</c:if>
		<c:if test="${!empty videoResourceEntity}">
		编辑资源
		</c:if>
	</h1>
</div>
<div class="row" style="margin-top: 5px;">
	<div class="col-xs-12">
		<form id="videoResourceForm" name="videoResourceForm" class="form-horizontal" role="form" method="post">
			<c:if test="${!empty videoResourceEntity}">
				<input type="hidden" id="pageNum" name="pageNum" value="${page.pageNum }"> 
				<input type="hidden" id="pageSize" name="pageSize" value="${page.pageSize }"> 
				<input type="hidden" id="orderByColumn" name="orderByColumn" value="${page.orderByColumn }"> 
				<input type="hidden" id="orderByType" name="orderByType" value="${page.orderByType }">
				<input type="hidden"  id='id' name="id" value="${videoResourceEntity.id }">
				 
			</c:if>
			
			<div class="form-group">
				<label class="control-label col-sm-1 no-padding-right" for="name">资源名称</label>
				<div class="col-sm-10">
				<div class="clearfix">
					<input class="form-control" name="name" id="name" type="text"
						value="${videoResourceEntity.name }" placeholder="资源名称" />
                         		</div>
				</div>
                       </div>
                    	<div class="form-group">
				<label class="control-label col-sm-1 no-padding-right" 
				for="url">源地址</label>
				<div class="col-sm-10">
				<div class="clearfix">
				<input class="form-control" name="url"  id="url" 
				 type="text" value="${videoResourceEntity.url }" placeholder="源地址..." />
				</div>
				</div>
			</div>
	
			<div class="form-group">
				<label class="control-label col-sm-1 no-padding-right" for="cover">封面</label>
				<div class="col-sm-10">
				<div class="clearfix">
				<input class="form-control" name="files" id="cover" type="file"
                  value="${videoResourceEntity.cover }" placeholder="封面..." />
                 <img id="imgCover" alt="" 
                 <c:if test="${null eq  videoResourceEntity.cover}">src="${ctx}/resources/images/xx.png"</c:if> 
                 <c:if test="${videoResourceEntity.cover != null}">src="${ctx}${videoResourceEntity.cover}"</c:if>
                  width="175px" height="100px">
				<label id="labcover" ></label>                
				 <input class="btn btn-primary btn-sm" type="button" value="上传" 
				 onclick="javascript:uploadVideoResource();"/>
				 <input id="hiddenResourceUrl" name="cover" type="hidden" />
				 	</div>
					</div>
						</div>	
			
						
				

			
			<div class="form-group">
				<label class="control-label col-sm-1 no-padding-right" for="size">大小</label>
				<div class="col-sm-10">
				<div class="clearfix">
					<input class="form-control" name="size" id="size" type="text"
						value="${videoResourceEntity.size }" onkeyup="value=value.replace(/[^(\d)]/g,'')" placeholder="大小..." />
						<label>只能输入数字</label>
				</div>
				</div>
			</div>
			
			<div class="form-group">
				<label class="control-label col-sm-1 no-padding-right" for="timeSpan">时长</label>
				<div class="col-sm-10">
				<div class="clearfix">
					<input class="form-control" name="timeSpan" id="timeSpan" type="text"
						value="${videoResourceEntity.timeSpan }" onkeyup="value=value.replace(/[^(\d)]/g,'')" placeholder="时长..." />
				 		<label>只能输入数字</label>
				</div>
				</div>
			</div>
			
			<div class="form-group">
				<label class="control-label col-sm-1 no-padding-right" for="source">来源</label>
				<div class="col-sm-10">
				<div class="clearfix">
					<input class="form-control" name="source" id="source" type="text"
						value="${videoResourceEntity.source }" placeholder="来源..." />
				</div>
				</div>
			</div>
			
			<div class="form-group">
				<label class="control-label col-sm-1 no-padding-right" for="h360pUrl">标清地址</label>
				<div class="col-sm-10">
				<div class="clearfix">
					<input class="form-control" name="h360pUrl" id="h360pUrl" type="text"
					<c:if test="${videoResourceEntity.h360pUrl eq null}">value="http://vc.sh.vnet.cn:8080/media/video/file1.mp4?appid="</c:if> 
					<c:if test="${videoResourceEntity.h360pUrl != null}">value="${videoResourceEntity.h360pUrl }"</c:if> 
					placeholder="标清地址..." />
				</div>
				</div>
			</div>
			
			<div class="form-group">
				<label class="control-label col-sm-1 no-padding-right" 
				for="h720pUrl">高清地址</label>
				<div class="col-sm-10">
				<div class="clearfix">
					<input class="form-control" name="h720pUrl" id="h720pUrl" 
					type="text" 
					<c:if test="${videoResourceEntity.h720pUrl eq null}">value="http://vc.sh.vnet.cn:8080/media/video/file1.mp4?appid="</c:if> 
					<c:if test="${videoResourceEntity.h720pUrl != null}">value="${videoResourceEntity.h720pUrl }"</c:if> 
					  placeholder="高清地址..." />
				</div>
				</div>
			</div>
			
			<div class="form-group">
				<label class="control-label col-sm-1 no-padding-right" for="h1080pUrl">超清地址</label>
				<div class="col-sm-10">
				<div class="clearfix">
					<input class="form-control" name="h1080pUrl" id="h1080pUrl" type="text"
						<c:if test="${videoResourceEntity.h1080pUrl eq null}">value="http://vc.sh.vnet.cn:8080/media/video/file1.mp4?appid="</c:if> 
					<c:if test="${videoResourceEntity.h1080pUrl != null}">value="${videoResourceEntity.h1080pUrl }"</c:if> 
						  placeholder="超清地址..." />
				</div>
				</div>
			</div>
			 <input type="hidden"  id='videoState' name="videoState" value="完成">
		</form>
		<div class="hr hr-dotted"></div>
	</div>
</div>
<div class="center">
	<button id="btnAdd" type="button" 
	onclick="javascript:$('#videoResourceForm').submit();" 
	class="btn btn-success btn-sm">
		<i class="fa fa-user-plus"></i>&nbsp;
		<c:if test="${empty videoResourceEntity}">
		添加
		</c:if>
		<c:if test="${!empty videoResourceEntity}">
		保存
		</c:if>
	</button>
	<button id="btn" type="button"
		onclick="webside.common.loadPage('/videoresource/listUI.html<c:if test="${!empty videoResourceEntity}">?page=${page.pageNum }&rows=${page.pageSize }&sidx=${page.orderByColumn }&sord=${page.orderByType }</c:if>')"
		class="btn btn-info btn-sm">
		<i class="fa fa-undo"></i>&nbsp;返回
	</button>
</div>
 